iT邦幫忙

2022 iThome 鐵人賽

DAY 11
0
Modern Web

前端開發維護筆記 - 打造健康的前端專案系列 第 11

Chromatic - 讓 Storybook 威力倍增的線上服務

  • 分享至 

  • xImage
  •  

上一篇介紹了 Storybook ,今天就來延伸介紹一個讓 Storybook 威力倍增的服務: Chromatic

Chromatic 是一個線上的服務,我們公司將其納入了開發流程之中,而且佔有相當程度的重要性。

這個服務是基於 Storybook,我們可以將專案的 Storybook 推送到 Chromatic 的雲端服務上,而他們則提供我們幾個好處:

線上展示最新的 Storybook

設計師與其他團隊成員可以直接透過 Chromatic 看到目前最新的 Storybook,不需要透過本地啟動的方式才能閱覽。

提供了 UI review 的功能

這點可以大大的提高團隊的協作性,RD 開發了新的組件並撰寫 Storybook 之後,可以在 PR 階段由設計師、PM 親自去確認組件是否符合需求。

而且當有任何不符合需求、需要調整的地方,也都能快速的在 Chromatic 上標注並留言。

提供了快照比對的功能

當現有的組件如果進行了修改,或是調整了 *.stories.ts 的展示,就會自動出現對比,並且需要由團隊成員進行 review 並確認,以避免在組件修改的過程中出現 UI 或功能性錯誤。


上一篇
前端的 Components 文件系統 - Storybook
下一篇
GrowthBook - feature flag 的管理工具
系列文
前端開發維護筆記 - 打造健康的前端專案27
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言